<template>
	<view class="container">
		<c-layout>
		
			<!-- 头部 -->
			<c-navigation-bar   leftIconBorder="#d5d5d68a"  slot="head" title="Dynamic" titleColor="#ffffff" navbarBgColor='#1B1D29' :bottomBorder="false">
			</c-navigation-bar>
			<view class="today-box"  slot="head" @click="backToday">
				Today
			</view>
			<!-- 日历 -->
			<view class="date">
				<calendar  ref="calender"></calendar>
			</view>
			
			<!-- 商品列表 -->
			<view class="goods-list">
				<view class="" v-for="item in lists" :key="item.id">
					<goodsInfo :goodsInfo="item"></goodsInfo>
				</view>
				
			</view>
		</c-layout>
	</view>
</template>
 
<script>
    export default {
        data() {
            return {
               day:"",
			   
			   lists:[
			   	{
			   		name: 'Black Heart',
			   		image:'@/static/images/user/closestore.png',
			   		by: 'Black Heart Institution Black Heart Institution Black Heart Institution',
			   		intro: 'Realize Syirian children Realize Syirian children Realize Syirian children',
			   		price: '198',
					id:56545
			   	},
			   	 {
			   		name: 'Black Heart',
			   		image:  require('static/images/login/ins.png'),
			   		by: 'Black Heart Institution',
			   		intro: 'Realize Syirian children',
			   		price: '198',
					id:5654544
			   	},
			   	 {
			   		name: 'Black Heart',
			   		image: require('static/images/login/ins.png'),
			   		by: 'Black Heart Institution',
			   		intro: 'Realize Syirian children',
			   		price: '198',
					id:565441445555
			   	},
				{
					name: 'Black Heart',
					image:  require('static/images/login/ins.png'),
					by: 'Black Heart Institution',
					intro: 'Realize Syirian children',
					price: '198',
					id:56514345
				},
				 {
					name: 'Black Heart',
					image:  require('static/images/login/ins.png'),
					by: 'Black Heart Institution',
					intro: 'Realize Syirian children',
					price: '198',
					id:5654222544
				},
				 {
					name: 'Black Heart',
					image: require('static/images/login/ins.png'),
					by: 'Black Heart Institution',
					intro: 'Realize Syirian children',
					price: '198',
					id:565752545555
				},
				{
					name: 'Black Heart',
					image:  require('static/images/login/ins.png'),
					by: 'Black Heart Institution',
					intro: 'Realize Syirian children',
					price: '198',
					id:56767545
				},
				 {
					name: 'Black Heart',
					image:  require('static/images/login/ins.png'),
					by: 'Black Heart Institution',
					intro: 'Realize Syirian children',
					price: '198',
					id:565884544
				},
				 {
					name: 'Black Heart',
					image: require('static/images/login/ins.png'),
					by: 'Black Heart Institution',
					intro: 'Realize Syirian children',
					price: '198',
					id:56555
				},
				{
					name: 'Black Heart',
					image:  require('static/images/login/ins.png'),
					by: 'Black Heart Institution',
					intro: 'Realize Syirian children',
					price: '198',
					id:545
				},
				 {
					name: 'Black Heart',
					image:  require('static/images/login/ins.png'),
					by: 'Black Heart Institution',
					intro: 'Realize Syirian children',
					price: '198',
					id:565454
				},
				 {
					name: 'Black Heart',
					image: require('static/images/login/ins.png'),
					by: 'Black Heart Institution',
					intro: 'Realize Syirian children',
					price: '198',
					id:565455
				},
				{
					name: 'Black Heart',
					image:  require('static/images/login/ins.png'),
					by: 'Black Heart Institution',
					intro: 'Realize Syirian children',
					price: '198',
					id:565
				},
				 {
					name: 'Black Heart',
					image:  require('static/images/login/ins.png'),
					by: 'Black Heart Institution',
					intro: 'Realize Syirian children',
					price: '198',
					id:554544
				},
				 {
					name: 'Black Heart',
					image: require('static/images/login/ins.png'),
					by: 'Black Heart Institution',
					intro: 'Realize Syirian children',
					price: '198',
					id:5654555
				}
			   ],
           }
        },
        methods: {
			//回到今天
			backToday(){
				 let now = new Date();
				 this.day = now.getDate();
				 this.current = this.day;
				 this.$refs.calender.backToday(this.current)
			},
           
        }
    }
</script>
 
<style scoped lang="scss">
	
	/deep/ .back-icon {
		border: 1px solid rgba(245, 246, 248, 0.5) !important;
	}
	
	/deep/ .more-icon .u-iconfont {
		color: #FFFFFF !important;
		font-size: 13px;
		font-weight: 400;
	}
	
	/deep/ .c-navigation-bar .u-iconfont {
		color: #FFFFFF !important;
		font-size: 13px !important;
		font-weight: 400 !important;
	}
	/deep/.productBox{
		border: 1px solid #f2f3f5;
		.middle-box{
			width: 50% !important;
		}
	}
	.container{
		        background-color: #1B1D29;
	}
	.today-box{
		position: absolute;
		top: 58rpx;
		right:20rpx;
		color: #F78585;
		width: 100rpx;
		z-index: 9999;
	}
	.date{
		margin-bottom: 20rpx;
	}
	
	.goods-list{
		background: #FFFFFF;
		border-radius: 60rpx 60rpx 0rpx 0rpx;
		padding: 30px;
		height: 100%;
		overflow: auto;
	}
  
</style>